<!DOCTYPE html>
<html ng-app="app" ng-controller="indexCtrl" style="height: 100%">

<head>
    <title>首页 {{getEnviroment()}}</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=8; IE=9; IE=EDGE;">

    <link href="./build/common/base.css" rel="stylesheet">
    <script type="text/javascript" src="./build/common/base.js"></script>
    <script type="text/javascript" src="./build/common/ngEdit.js"></script>
    <script type="text/javascript" src="./build/home/index.js"></script>
    <script type="text/javascript" src="./assets/js/plugins/pace/pace.min.js"></script>
</head>

<body ng-click="hiddMent()" class="fixed-sidebar full-height-layout gray-bg" style="overflow:hidden">
    <div id="wrapper">
        <!--左侧导航开始-->
        <nav class="navbar-default navbar-static-side" role="navigation">
            <div class="nav-close"><i class="fa fa-times-circle"></i>
            </div>
            <div class="sidebar-collapse" style="background-color: #fff;">
                <div ng-mouseleave="hiddenMenu($event)" class="my_two_menu" ng-mouseenter="showSonMenus($event)">
                    <div ng-click="menuClick(childrenItem)" ng-mouseenter="showThreeSonMenus(childrenItem,$event)"
                        class="my_two_menu_box" ng-repeat="childrenItem in childrenMemus track by $index">
                        <a class="J_menuItem my_hover">
                            {{childrenItem.name}}
                        </a>
                    </div>
                    <div class="my_two_menu_three">
                        <div class="my_three_hove" ng-repeat="four in threeMenu track by $index"
                            ng-click="menuClick(four)">
                            <a class="J_menuItem my_hover_three">{{four.name}}</a>
                        </div>
                    </div>
                </div>


               <!-- <li class="nav-header" style="padding-left: 5px;">
                    <div class="dropdown profile-element my_logo">
                        <img alt="image" src="./assets/img/logo/logo.png"
                             style="position: absolute; width: 60px; margin-top: 8px" />
                        <span
                                style="letter-spacing: 1px;position: absolute; top: 20px; left: 59px;font-size: 15px;font-weight: 600; color: #fff;">供应链工作流引擎系统</span>
                    </div>
                    <div class="logo-element">
                    </div>
                    &lt;!&ndash; <div class="my_logo_box">
                            <img src="./assets/img/logo.png" style="width: 200px;" alt="" class="my_logo">

                        </div> &ndash;&gt;
                </li>
-->

                <ul class="nav" id="side-menu">
                    <!-- 个人信息 -->
                    <li class="nav-header">
                        <div class="dropdown profile-element my_logo">
                            <img alt="image" src="./assets/img/logo/logo_xy.png"
                                 style="position: absolute; width: 60px; margin-top: 8px" />
                            <span
                                    style="white-space:nowrap;letter-spacing: 1px;position: absolute; top: 20px; left: 59px;font-size: 14px;font-weight: 555; color: #fff;">供应链工作流引擎系统</span>
                        </div>
                        <div class="logo-element">
                        </div>
                        <!-- <div class="my_logo_box">
                                <img src="./assets/img/logo.png" style="width: 200px;" alt="" class="my_logo">
    
                            </div> -->
                    </li>
                    <!--菜单 -->
                    <li ng-repeat="item in memus" class="{{item.opened==1?'active':''}} menu_show" ng-if="item.enable">
                        <a href="javascript:void(0);" ng-mouseenter="showSonMenu(item.children,$event)"
                            ng-click="menuClick(item)" ng-mouseleave="hiddenMenu($event)">
                            <i class="fa {{item.icon}}"></i>
                            <span class="nav-label" style="color:#A2AEBD;">{{item.name}}</span>
                            <!-- <span class="fa arrow" ng-if="item.children.length"></span> -->
                        </a>
                    </li>
                    <!-- <li ng-repeat="item in memus" class="{{item.opened==1?'active':''}}" ng-if="item.enable">
                        <a href="javascript:void(0);" ng-click="menuClick(item)">
                            <i class="fa {{item.icon}}"></i>
                            <span class="nav-label">{{item.name}}</span>
                            <span class="fa arrow" ng-if="item.children.length"></span>
                        </a>
                    </li> -->
                </ul>




            </div>
        </nav>
        <!--左侧导航结束-->
        <!--右侧部分开始-->
        <div id="page-wrapper" class="gray-bg dashbard-1">
            <div class="row border-bottom nav_show">
                <nav class="navbar navbar-static-top" role="navigation" style="margin-bottom: 0">
                    <div class="navbar-header" style="width:77%">
                        <a ng-repeat="topMenu in userRes" ng-click="topClick(topMenu)" ab-tip title="{{topMenu.name}}"
                            ng-if="topMenu.enable"
                            class="navbar-minimalize minimalize-styl-2 btn btn-primary {{topMenu.active}} my_menu_list"
                            href="javascript:void(0);">
                            <!-- 导航栏的小图标移除 -->
                            <!-- <i class="fa fa-{{topMenu.icon ||'server'}} fa-2x" style="display: block;"></i> -->
                            {{topMenu.name}}
                            <i class="my_link"></i>
                        </a>
                    </div>
                    <ul class="nav navbar-top-links navbar-right">
                        <li>
                            <a data-toggle="dropdown" class="dropdown-toggle" href="javascript:void(0);">
                                <span class="clear">
                                    <span class="text-muted text-xs block ">{{userMsg.user.fullname}}<b
                                            class="caret"></b></span>
                                </span>
                            </a>
                            <ul class="dropdown-menu dropdown-alerts" style="width: 220">
                                <li>
                                    <a href="#">
                                        <div>
                                            <i class="fa  fa-user">{{userMsg.currentOrg.groupName}}</i>
                                            <span class="pull-right btn btn-xs btn-primary">当前组织</span>
                                        </div>
                                    </a>
                                </li>
                                <li class="divider"></li>
                                <li ng-repeat="org in userMsg.orgList"
                                    ng-show="org.groupId != userMsg.currentOrg.groupId">
                                    <a href="#">
                                        <div>
                                            <i class="fa fa-users"></i> {{org.groupName}}
                                            <span class="pull-right btn btn-xs btn-success fa fa-exchange"
                                                ng-click="changeCurrentOrg(org.groupId)">切换组织</span>
                                        </div>
                                    </a>
                                </li>
                                <li ng-repeat="system in userMsg.subsystemList"
                                    ng-show="system.id != userMsg.currentSystem.id">
                                    <a href="#">
                                        <i class="fa fa-align-justify"></i> {{system.name}}
                                        <span class="pull-right btn btn-xs btn-danger fa fa-exchange"
                                            ng-click="changeCurrentSystem(system)">切换系统</span>
                                    </a>
                                </li>
                                <li class="divider"></li>
                                <li>
                                    <a class="btn btn-sm fa fa-user" ng-click="roleInfo()"   href="javascript:void(0)">角色维护</a>
                                    <a class="btn btn-sm fa fa-users" ng-click="authMange()"   href="javascript:void(0)">权限管理</a>
                                    <a class="btn btn-sm fa fa-cog" ng-click="paramMange()"   href="javascript:void(0)">参数设置</a>
                                    <a class="btn btn-sm fa fa-exchange" ng-click="acivityMange()"   href="javascript:void(0)">工作流设置</a>
                                    <a class="btn btn-sm fa fa-paper-plane" ng-click="jobchangeMange()"   href="javascript:void(0)">工作交接</a>
                                    <a class="btn btn-sm fa fa-smile-o" ng-click="userInfo()" href="javascript:void(0)">个人资料</a>
                                    <a class="btn btn-sm fa fa-key" ng-click="editPassworld()" href="javascript:void(0)">修改密码</a>
                                    <a class="btn btn-sm fa fa-edit" ng-click="editUserInfo()" href="javascript:void(0)">修改资料</a>
                                </li>
                                <li class="divider"></li>
                                <li><a href="#" class="fa fa-arrow-circle-right" ng-click="logout()">安全退出</a></li>

                            </ul>
                        </li>
                    </ul>
                   <!-- <ul class="nav navbar-top-links navbar-right">
                        <li class="dropdown">
                            <a class="dropdown-toggle count-info" data-toggle="dropdown" href="javascript:void(0);">
                                <i class="fa fa-bell"></i> <span class="label label-primary">8</span>
                            </a>
                            <ul class="dropdown-menu dropdown-alerts">
                                <li>
                                    <a href="#">
                                        <div>
                                            <i class="fa fa-envelope fa-fw"></i>系统目前支持第三方消息
                                            <span class="pull-right text-muted small">4分钟前</span>
                                        </div>
                                    </a>
                                </li>
                                <li class="divider"></li>
                                <li>
                                    <a href="#">
                                        <div>
                                            <i class="fa fa-qq fa-fw"></i> 如 邮件、短信、钉钉等
                                            <span class="pull-right text-muted small">12分钟前</span>
                                        </div>
                                    </a>
                                </li>
                                <li class="divider"></li>
                                <li>
                                    <div class="text-center link-block">
                                        <a class="J_menuItem" href="#">
                                            <strong>稍后会推出：站内消息、消息平台消息日志</strong>
                                            <i class="fa fa-angle-right"></i>
                                        </a>
                                    </div>
                                </li>
                            </ul>
                        </li>

                    </ul>-->
                    <!-- 项目选择 -->
                    <div ng-click="showMenu(e)" class="itemList navbar-right nav" style="margin-right: 38px;">
                        <span class="itemOp">项目选择</span>
                        <img src="./assets/img/xiangxia.png" alt="" style="width: 16px; margin-right: -5px;">
                        <div class="showMenu" ng-repeat="project  in  projectMsg" id="{{project.id}}"     ng-click="queryProjectState(project)" >
                            <div class="bgStyle">{{project.projectname}}</div>
                        </div>
                    </div>

                </nav>
            </div>

            <!-- TAB列 -->
            <div class="row content-tabs">
                <button style="left: 60px;" class="roll-nav roll-left J_tabLeft"><i class="fa fa-backward"></i>
                </button>
                <nav class="page-tabs J_menuTabs">
                    <div class="page-tabs-content">
                        <a ng-repeat="menu in openedMenu" id="{{menu.id}}" ng-click="menuClick(menu,true)"
                            href="javascript:void(0);" class="{{menu.active}} J_menuTab">{{menu.name}}
                            <i ng-if="!menu.noclose" class="fa fa-times-circle" ng-click="closeTab(menu)"></i>
                        </a>
                    </div>
                </nav>
                <div class="hand_show fa fa-angle-double-up">
                </div>
                <div class="left_show fa fa-angle-double-left">
                </div>
                <button class="roll-nav roll-right J_tabRight"><i class="fa fa-forward"></i>
                </button>
                <div class="btn-group roll-nav roll-right" style="right: 0px;">
                    <button class="dropdown J_tabClose" data-toggle="dropdown">关闭操作<span class="caret"></span></button>
                    <ul role="menu" class="dropdown-menu dropdown-menu-right">
                        <li class="J_tabShowActive"><a>定位当前选项卡</a>
                        </li>
                        <li class="divider" ng-click="scrollCurrent()"></li>
                        <li class="J_tabCloseAll" ng-click="closeAll()"><a>关闭全部选项卡</a>
                        </li>
                        <li class="J_tabCloseOther" ng-click="closeOthers()"><a>关闭其他选项卡</a>
                        </li>
                    </ul>
                </div>
            </div>
            <!-- iframe 内容区 -->
            <div class="row J_mainContent" id="content-main" >
                <iframe class="J_iframe {{menu.active=='active'?'iframe-block':'iframe-none'}}" width="100%"
                    height="100%" frameborder="0" seamless ng-repeat="menu in openedMenu"
                    ng-src="{{menu.url | trustedAsResourceUrl}}" id="{{menu.id}}iframe"></iframe>
            </div>

            <div class="footer">
                <div class="pull-right">&copy; 2019 All Rights Reserved. 北京星云通力科技有限公司 </div>
            </div>
        </div>
        <!--右侧部分结束-->
    </div>
</body>

</html>
<script>
    var ifShow = false
    // fa-angle-double-down
    $(".hand_show").click(function () {
        if (ifShow == false) {
            $(".nav_show").slideUp(200)
            $(".hand_show").removeClass("fa-angle-double-up").addClass("fa fa-angle-double-down")
            ifShow = !ifShow
        } else {
            $(".nav_show").slideDown(200)
            $(".hand_show").removeClass("fa-angle-double-down").addClass("fa fa-angle-double-up")
            ifShow = !ifShow
        }
    })
    var ifLeftShow = false
    $(".left_show").click(function () {
        if (ifLeftShow == false) {
            $(".navbar-default").fadeOut(300, function () {
                $("#page-wrapper").css("margin-left", "0")
                $(".left_show").removeClass("fa-angle-double-left").addClass("fa-angle-double-right")
            })
            ifLeftShow = !ifLeftShow
        } else {
            $(".navbar-default").fadeIn(400)
            // $(".navbar-default").addClass("animated fadeInLeft")
            $("#page-wrapper").css("margin-left", "220px")
            $(".left_show").removeClass("fa-angle-double-right").addClass("fa-angle-double-left")
            ifLeftShow = !ifLeftShow

        }
    })
</script>
<style>
    .menu_three {
        width: 100px;
        height: 100px;
        background-color: pink;
    }

    .row .content-tabs .roll-left {
        left: 60px;
    }

    .my_link {
        display: none;
        position: absolute;
        width: 100%;
        height: 4px;
        background-color: #1ab394;
        bottom: 0;
        left: 0;
    }

    .my_menu_list.navbar-minimalize.minimalize-styl-2:hover .my_link {
        display: block;
    }

    .my_menu_list.menuActive .my_link {
        display: block;
    }

    .menu_show:hover .nav-label {
        color: #fff !important;
    }

    .my_menu_list.navbar-minimalize.minimalize-styl-2:hover .my_link {
        display: block;
    }

    .my_two_menu {
        /* width: 380px; */
        position: absolute;
        left: 220px;
        height: 200px;
        opacity: 1;
    }


    .navbar-static-side .my_two_menu_box {
        cursor: pointer;
        text-align: center;
        line-height: 46.4px;
        /* height: 46.4px; */
        background-color: #fff;
        position: relative;
        z-index: 9999;
        width: 160px;
    }

    .my_two_menu_three {
        background-color: #fff;
        width: 160px;
        cursor: pointer;
        text-align: center;
        line-height: 46.4px;
        position: absolute !important;
        left: 160px;
    }

    .my_hover {
        color: #A2AEBD;
    }

    .my_two_menu_box:hover {
        background-color: #18a689;
    }

    .my_three_hove:hover {
        background-color: #18a689;
    }

    .my_three_hove:hover .my_hover_three {
        color: #fff;
    }

    .btn-primary.focus,
    .btn-primary:focus {
        background-color: transparent;
        border-color: transparent;
    }

    .my_two_menu_box:hover .my_hover {
        color: #fff;
    }




    .my_two_menu_three .my_hover_three {
        color: #A2AEBD;
    }

    .navbar-minimalize.my_menu_list {
        padding: 13px 18px;
        color: #A2AEBD;
        position: relative;
    }

    .my_menu_list:hover {
        background-color: transparent;
        border-color: transparent;
        color: #fff;
    }


    .left_show {
        width: 50px;
        line-height: 40px;
        font-size: 30px;
        text-align: center;
        height: 100%;
        top: 0;
        left: 0;
        position: absolute;
        border-left: 1px solid #eee;
        background-color: #fff;
    }

    .left_show_img {
        width: 20px;
        margin-left: 20px;
        transform: rotate(-90deg)
    }

    .hand_show {
        width: 50px;
        height: 100%;
        top: 0;
        right: 120px;
        position: absolute;
        border-left: 1px solid #eee;
        background-color: #fff;
        text-align: center;
        line-height: 40px;
        font-size: 30px;
    }

    /* 
    .hand_show_img {
        width: 20px;
        margin-left: 20px;
    } */

    .showMenu>div:hover,
    .showMenu:focus {
        background-color: #1ab394;
        color: white;
    }

    .showMenu {
        display: none;
        background-color: #fff;
    }

    .itemList {
        border-radius: 5px;
        text-align: center;
        line-height: 26px;
        width: 100px;
        height: 26px;
        background-color: #1ab394;
        color: #fff;
        margin-top: 18px;
        cursor: pointer
    }

    .showMenu div {
        text-align: center;
        color: #000;
        width: 100px;
        height: 30px;
        background-color: #fff;
        border-bottom: 1px solid #ccc;
    }

    .iframe-block {
        display: block
    }

    .iframe-none {
        display: none;
    }

    * {
        -webkit-user-select: none;
    }

    ::-webkit-scrollbar-thumb {
        background-color: #f5f5f5;
    }

    .nav-header {
        height: 61px;
        padding: 2px 12px;
        border-bottom: 1px solid #333;
    }

    .nav-item {
        display: inline;
        line-height: 40px;
        font-size: 18px;
    }

    .btn-primary {
        margin: 10px 0 10px 10px;
        0background-color: #609e94;
        border-color: transparent;
        0color: #fff;
        background-color: transparent;
        color: #609e94;
    }

    .btn-primary.menuActive {
        color: #fff;
    }

    .my_link.active {
        display: block;
    }


    .nav>li.active {
        border-left: 4px solid #F0F0F0;
        background: transparent;
    }
</style>